<template>
  <div class="app-container" style="position: static;">
   <el-row :gutter="20" style="margin-top:10px;height: 100%;margin-left: 0"
           v-loading="loading"
   element-loading-text="加载中..."
    element-loading-spinner="el-icon-loading"
   >
      <!--部门数据-->
      <el-col :span="4" style="min-width: 260px">
        <div class="head-container">
          <h3 style="margin-top: 0">需求管理

            <el-link
              class="tree-node-btn"
              :underline="false" style="margin-left: 10px;" v-hasPermi="['fun:demand:ai_create']" icon="el-icon-magic-stick" title="一键生成测试点" @click="handleAiCreateAllPointAndCase"  type="primary" ></el-link>

            <el-link
              class="tree-node-btn"
              :underline="false" style="margin-left: 10px;" title="刷新树结构" :disabled="treeRefreshStatus.disabled" :icon="treeRefreshStatus.icon" type="primary"  @click="refreshTree"></el-link>

            <el-link
              class="tree-node-btn"
              :underline="false" icon="el-icon-download" v-hasPermi="['fun:demand:import']" title="导入需求" type="primary"  @click="handleImport"></el-link>




          </h3>
          <el-tree
            class="fun-tree-class"
            :data="projectFunTreeData"
            :props="defaultProps"
            :expand-on-click-node="false"
            :defaultExpandLevel="0"
            :isDefaultExpanded="false"
            show-checkbox
            @check="handleCheckChange"
            ref="tree"
            node-key="id"
            highlight-current
            :render-content="renderContent"
            @node-click="handleNodeClick"

          />

          <div class="one-step-create-example" @click="handleAiCreateAllPointAndCase">
            一键生成用例
          </div>


        </div>
      </el-col>

      <el-col :span="20" style="max-width: calc(100% - 263px)">

        <div class="gray-bg">
          <custom-progress v-if="batchCreateCaseRecordTip" style="position:
          relative;bottom: -3px"
                           :textTip="batchCreateCaseRecordTip"
                           :percentage="String(batchCreateCaseRecord)"/>
        </div>




      <el-tabs v-model="activeName" @tab-click="handleClick"
               class="fun-tabs-class">
        <el-tab-pane label="需求" name="first" class="fun-right">
        <div v-show="!pageShow">
          <el-empty description="请点击左侧树形菜单,选择子功能查看详情"></el-empty>
        </div>
        <div v-show="pageShow" >

          <h3 style="margin-top: 20px;margin-bottom: 14px;">路径


          <el-button class="opt-btn-class" v-hasPermi="['fun:demand:export']"
                      @click="exportWord(projectFunDetailInfo.funNo)" plain style="float:right;">导出需求</el-button>
          <el-button class="opt-btn-class" v-if="projectFunDetailInfo.isChecked == 0"
                      @click="checkPass" plain style="float:right;">评审通过</el-button>
          <el-button class="opt-btn-class" v-if="projectFunDetailInfo.isChecked == 1"
                       type="success" disabled plain  style="float:right;">评审已通过</el-button>
          <el-button class="opt-btn-class"
                      @click="save" plain style="float:right;">保存</el-button>
          <el-button class="opt-btn-class"
                      @click="handleAiCreateAllIncrementPointAndCase" plain style="float:right;">生成增量用例</el-button>
          </h3>
          <el-breadcrumb class="breadcrumb-class"
                         separator-class="el-icon-arrow-right">
              <el-breadcrumb-item v-for="path in projectFunDetailInfo.pathNames">{{path}}</el-breadcrumb-item>
          </el-breadcrumb>



         <h3 @mouseover="projectFunDetailInfo.rolePermissionShow = true" @mouseout="projectFunDetailInfo.rolePermissionShow = false">
<!--         <el-link v-hasPermi="['fun:demand:add']"  v-show="projectFunDetailInfo.rolePermissionShow" icon="el-icon-plus" type="primary" @click="addRolePermission(projectFunDetailInfo)">添加</el-link>-->

           <span style="display: flex;width: 100%;justify-content:space-between;align-items: center;height:30px;">
             <span style="line-height: unset">功能权限</span>
             <el-button v-hasPermi="['fun:demand:add']"
                      style="margin-bottom: 10px;margin-right: 5px"
                      size="small"
                        class="el-button-new"
                      icon="el-icon-plus"
                      @click="addRolePermission(projectFunDetailInfo)">添加</el-button>

           </span>


           <el-table
            :data="projectFunDetailInfo.rolePermissionList"
            border
            style="width: 100%;margin-top: 16px;">
             <el-table-column
              label="序号"
              align="center"
              type="index"
              width="50">
            </el-table-column>
            <el-table-column
              prop="roleName"
              label="角色名称"
              width="180">
            </el-table-column>
            <el-table-column
              prop="permissionName"
              label="权限">
            </el-table-column>
            <el-table-column
              prop="description"
              label="备注">
            </el-table-column>
            <el-table-column
              width="180"
              label="操作" align="right" prop="id">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  v-hasPermi="['fun:demand:edit']"
                  @click="updateRolePermission(scope.row)"
                >修改</el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  v-hasPermi="['fun:demand:remove']"
                  @click="delRolePermission(scope.row.id)"
                >删除</el-button>
              </template>
            </el-table-column>
          </el-table>
         </h3>


         <h3>功能描述
          <!--
          <el-link
            style="float: right;margin-right: 5px;"
            @click="showTestPointAndCase(projectFunDetailInfo.projectNo, projectFunDetailInfo.funNo, 'FUN', null)">用例数: {{projectFunDetailInfo.funCaseNum}}</el-link>
          -->


         </h3>

          <el-input class="fun-desc-textarea"
                     v-model="projectFunDetailInfo.funDesc" @change="updateFunDesc"  type="textarea" placeholder="请输入功能描述" show-word-limit
          :autosize="{minRows: 4, maxRows: 4}" :style="{width: '100%'}"></el-input>


          <h3>流程图

          <el-upload style="float: right;" v-hasPermi="['fun:demand:add']"
            :auto-upload="true" :action="''" :show-file-list="false"  :http-request="tempProcessFileUpload" >
            <el-button class="el-button-new" style="margin-right: 5px;"
                       :icon="processImageIcon"
                        :disabled="processImageDisabled" size="small" plain >{{processImageText}}</el-button>
          </el-upload>

          </h3>
          <template v-if="projectFunDetailInfo.processImages.length > 0">
            <div v-for="processImage in projectFunDetailInfo.processImages"
                 class="flow-img-item">
            <el-image style="width:120px; height:120px;
            border: 1px solid #DFE6EC;"
                      :src="'data:image/gif;base64,'+processImage.imgBase64" :preview-src-list="['data:image/gif;base64,'+processImage.imgBase64]" :fit='"contain"'>
              <div slot="placeholder" class="image-slot">
                加载中<span class="dot">...</span>
              </div>
            </el-image>
            <div
              style="width:120px;border: 1px solid #DFE6EC;
              border-top: unset;display:flex;
              justify-content: center;height:30px;
              background: #F8F8F9">
              <el-link icon="el-icon-delete" v-hasPermi="['fun:demand:remove']" type="primary" @click="delProcessImage(processImage.id)">删除</el-link>
            </div>
            </div>
          </template>
          <template v-if="projectFunDetailInfo.processImages.length == 0">
            <span>无流程图</span>
          </template>


          <h3 @mouseover="projectFunDetailInfo.processInfoShow = true" @mouseout="projectFunDetailInfo.processInfoShow = false">


            <span style="display: flex;width: 100%;justify-content:space-between;align-items: center;height:30px;">
             <span style="line-height: unset">流程描述</span>
              <span style="display: flex;align-items: center;column-gap: 24px">
                <el-link @click="showTestPointAndCase(projectFunDetailInfo.projectNo, projectFunDetailInfo.funNo, 'PROCESS', null)" >用例数: {{projectFunDetailInfo.processCaseNum}}</el-link>
                <el-button style="margin-left: 5px;margin-right: 10px;"
                           class="el-button-new"
                      v-hasPermi="['fun:demand:add']"
                           icon="el-icon-plus"
                           @click="addFunProcessInfo(projectFunDetailInfo)">
                  添加</el-button>

              </span>
           </span>




<!--         <el-link type="primary" @click="showTestPointAndCase(projectFunDetailInfo.projectNo, projectFunDetailInfo.funNo, 'PROCESS', null)" >用例数: {{projectFunDetailInfo.processCaseNum}}</el-link>-->
<!--         <el-link style="margin-left: 5px;" v-hasPermi="['fun:demand:add']" v-show="projectFunDetailInfo.processInfoShow" icon="el-icon-plus" type="primary"  @click="addFunProcessInfo(projectFunDetailInfo)">添加</el-link>-->


            <el-table
            :data="projectFunDetailInfo.processInfoList"
            :border="true"
            style="width: 100%;margin-top: 16px;">
             <el-table-column
             label="序号"
             align="center"
              type="index"
              width="50">
            </el-table-column>
            <el-table-column
              prop="processStepDesc"
              label="流程步骤描述"
              >
            </el-table-column>
            <el-table-column width="180"
              label="操作" align="right" prop="id">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  v-hasPermi="['fun:demand:edit']"
                  @click="updateFunProcessInfo(scope.row)"
                >修改</el-button>
                <el-button
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  v-hasPermi="['fun:demand:remove']"
                  @click="delFunProcessInfo(scope.row.id)"
                >删除</el-button>
              </template>
            </el-table-column>
          </el-table>
         </h3>


          <h3 @mouseover="projectFunDetailInfo.pageInfoShow = true" @mouseout="projectFunDetailInfo.pageInfoShow = false" >

            <span style="display: flex;width: 100%;justify-content:space-between;align-items: center;height:30px;">
             <span style="line-height: unset">页面信息</span>
            <el-button v-hasPermi="['fun:demand:add']" icon="el-icon-plus"
                      class="el-button-new"
                       style="margin-right: 5px;"
                       size="small"
                       @click="addPageInfo(projectFunDetailInfo.projectNo,
                       projectFunDetailInfo.funNo)">添加</el-button>

           </span>

          </h3>
          <el-form v-for="pageInfo in projectFunDetailInfo.pageInfos">
            <el-form-item label="页面名称" prop="mobile" class="custom-form-item">
              <el-button icon="el-icon-delete"
                         style="float: right;margin-right: 5px;"
                         class="el-button-new"
                         size="small"
                        v-hasPermi="['fun:demand:remove']"
                         :title="'删除当前页面【'+pageInfo.pageName+'】'"
                         @click="delPageInfo(pageInfo.pageNo)">删除</el-button>

              <el-input class="fun-desc-textarea" style="margin-top: 10px;" @change="updatePageName(pageInfo)"
                         placeholder="请输入页面名称" v-model="pageInfo.pageName"   clearable />


            </el-form-item>

            <el-form-item label="输入项" prop="mobile" class="custom-form-item" >



              <el-button class="el-button-new" style="margin-right: 5px;
              float:right;margin-bottom: 10px"
                         v-hasPermi="['fun:demand:remove']"
                         icon="el-icon-delete"
                         size="small"
                         :title="'删除当前页面【'+pageInfo.pageName+'】的所有输入项'"
                         @click="delPageInputOptions(pageInfo.pageNo)">删除
              </el-button>

<!--              <el-button class="el-button-new"-->
<!--                         style="margin-right: 5px;float:right;-->
<!--                         margin-bottom: 10px"-->
<!--                        v-hasPermi="['fun:demand:add']"-->
<!--                         icon="el-icon-magic-stick"-->
<!--                         size="small"-->
<!--                         :title="'上传表格图片自动识别输入项内容'"-->
<!--                         @click="addPageInputOptionByAi(pageInfo)">ai-->
<!--                识图</el-button>-->


              <el-button class="el-button-new" style="float: right;
              margin-bottom: 10px"
                         icon="el-icon-plus"
                         v-hasPermi="['fun:demand:add']"
                         size="small"
                         :title="'添加当前页面【'+pageInfo.pageName+'】新的输入项'"
                         @click="addPageInputOption(pageInfo)">添加</el-button>


              <el-table
                :data="pageInfo.inputOptions"
                border
                style="width: 100%;">
                 <el-table-column
                 label="序号"
                 align="center"
                  type="index"
                  width="50">
                </el-table-column>

                <el-table-column
                  prop="name"
                  label="要素名称"
                  width="180">
                </el-table-column>
                <el-table-column
                  prop="must"
                  label="是否必填"
                  width="180">
                  <template slot-scope="scope">
                    <dict-tag :options="dict.type.is_must" :value="scope.row.must"/>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="optionComponentType"
                  label="组件类型">
                  <template slot-scope="scope">
                    <dict-tag :options="dict.type.input_component_type" :value="scope.row.optionComponentType"/>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="inputType"
                  label="输入类型">
                  <template slot-scope="scope">
                    <dict-tag :options="dict.type.input_type" :value="scope.row.inputType"/>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="option"
                  label="可选项">
                </el-table-column>

                <el-table-column
                  prop="optionTitle"
                  label="提示">
                </el-table-column>

                <el-table-column
                  prop="inputConstraint"
                  label="约束">
                </el-table-column>

                <el-table-column
                  prop="description"
                  label="备注">
                </el-table-column>
                <el-table-column
                  prop="inputOptionCaseNum"
                  label="用例数"
                  width="100">
                  <template slot-scope="scope">
                    <el-link type="primary" @click="showTestPointAndCase(projectFunDetailInfo.projectNo, projectFunDetailInfo.funNo, 'PAGE_INPUT', scope.row.id)" >{{scope.row.inputOptionCaseNum}}</el-link>
                  </template>
                </el-table-column>
                <el-table-column
                  width="180"
                  label="操作" align="right" prop="id">
                  <template slot-scope="scope">
                    <el-button
                      size="mini"
                      type="text"
                      icon="el-icon-edit"
                      v-hasPermi="['fun:demand:edit']"
                      @click="updatePageInputOption(scope.row)"
                    >修改</el-button>
                    <el-button
                      size="mini"
                      type="text"
                      icon="el-icon-delete"
                      v-hasPermi="['fun:demand:remove']"
                      @click="delPageInputOption(scope.row.id, scope.row.pageNo)"
                    >删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-form-item>


            <el-form-item label="输出项"  prop="mobile" class="custom-form-item">

              <el-button v-hasPermi="['fun:demand:remove']"
                       style="margin-right: 5px;margin-bottom: 10px;float:right;"
                       class="el-button-new"
                       size="small"
                       icon="el-icon-delete"
                       :title="'删除当前页面【'+pageInfo.pageName+'】的所有输出项'"
                       @click="delPageOutOptions(pageInfo.pageNo)">删除</el-button>

<!--              <el-button v-hasPermi="['fun:demand:add']"-->
<!--                         style="margin-right: 5px;margin-bottom: 10px;float:right;"-->
<!--                         class="el-button-new"-->
<!--                         size="small"-->
<!--                         icon="el-icon-magic-stick"-->
<!--                         :title="'上传表格图片自动识别输出项内容'"-->
<!--                         @click="addPageInputOptionByAi1(pageInfo)">ai识图</el-button>-->

              <el-button v-hasPermi="['fun:demand:add']"
                         style="margin-bottom: 10px;float:right;"
                       class="el-button-new"
                       size="small"
                       icon="el-icon-plus"
                       :title="'添加当前页面【'+pageInfo.pageName+'】新的输出项'"
                       @click="addPageOutOption(pageInfo)">添加</el-button>


              <el-table
                :data="pageInfo.outOptions"
                border
                style="width: 100%">
                 <el-table-column
                 label="序号"
                 align="center"
                  type="index"
                  width="50">
                </el-table-column>

                <el-table-column
                  prop="name"
                  label="要素名称"
                  width="180">
                </el-table-column>

                <el-table-column
                  prop="optionComponentType"
                  label="输出形式">
                  <template slot-scope="scope">
                    <dict-tag :options="dict.type.output_component_type" :value="scope.row.optionComponentType"/>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="description"
                  label="备注">
                </el-table-column>
                <el-table-column
                  prop="outOptionCaseNum"
                  label="用例数"
                  width="100">
                  <template slot-scope="scope">
                    <el-link type="primary" @click="showTestPointAndCase(projectFunDetailInfo.projectNo, projectFunDetailInfo.funNo, 'PAGE_OUTPUT', scope.row.id)" >{{scope.row.outOptionCaseNum}}</el-link>
                  </template>
                </el-table-column>
                <el-table-column
                  width="180"
                  label="操作" align="right" prop="id">
                  <template slot-scope="scope">
                    <el-button
                      size="mini"
                      type="text"
                      icon="el-icon-edit"
                      v-hasPermi="['fun:demand:edit']"
                      @click="updatePageOutOption(scope.row)"
                    >修改</el-button>
                    <el-button
                      size="mini"
                      type="text"
                      icon="el-icon-delete"
                      v-hasPermi="['fun:demand:remove']"
                      @click="delPageOutOption(scope.row.id, scope.row.pageNo)"
                    >删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-form-item>


            <el-form-item label="业务规则"  prop="mobile" class="custom-form-item">


              <el-button v-hasPermi="['fun:demand:remove']"
                       style="float:right;margin-bottom: 10px;"
                       class="el-button-new"
                       size="small"
                       icon="el-icon-delete"
                       :title="'删除当前页面【'+pageInfo.pageName+'】的所有业务规则'"
                       @click="delPageBusRules(pageInfo.pageNo)">删除</el-button>

              <el-button v-hasPermi="['fun:demand:add']"
                         icon="el-icon-plus"
                         class="el-button-new"
                         size="small"
                         style="float: right;
                       margin-right: 5px;
                       margin-bottom: 10px;"
                         :title="'添加当前页面【'+pageInfo.pageName+'】新的业务规则'"
                         @click="addPageBusRules(pageInfo)">添加</el-button>




              <el-table
                :data="pageInfo.pageRuleList"
                border
                style="width: 100%">
                 <el-table-column
                 label="序号"
                 align="center"
                  type="index"
                  width="50">
                </el-table-column>

                <el-table-column
                  prop="ruleStepDesc"
                  label="规则描述"
                  >
                </el-table-column>

                <el-table-column
                  prop="ruleCaseNum"
                  label="用例数"
                  width="100">
                  <template slot-scope="scope">
                    <el-link type="primary" @click="showTestPointAndCase(projectFunDetailInfo.projectNo, projectFunDetailInfo.funNo, 'FUN', scope.row.id)" >{{scope.row.ruleCaseNum}}</el-link>
                  </template>
                </el-table-column>
                <el-table-column
                  width="180"
                  label="操作" align="right" prop="id">
                  <template slot-scope="scope">
                    <el-button
                      size="mini"
                      type="text"
                      icon="el-icon-edit"
                      v-hasPermi="['fun:demand:edit']"
                      @click="updatePageBusRules(scope.row)"
                    >修改</el-button>
                    <el-button
                      size="mini"
                      type="text"
                      icon="el-icon-delete"
                      v-hasPermi="['fun:demand:remove']"
                      @click="delPageBusRule(scope.row.id, scope.row.pageNo)"
                    >删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-form-item>
            <hr tyle="border: 5px; color: #ccc;"/>
          </el-form>

          <!-- 添加左侧树形结构 -->
          <el-dialog
            :title="updateFunInfo.title"
            :visible.sync="updateFunInfo.show"
            :before-close="handleClose"
            append-to-body
            width="30%"
          >
            <el-form ref="updateFunInfo" :model="updateFunInfo" label-width="80px">
              <el-form-item label="上级名称" v-if="updateFunInfo.parentProjectFunName" prop="parentProjectFunName">
                <el-input v-model="updateFunInfo.parentProjectFunName" :disabled="true" />
              </el-form-item>
              <el-form-item label="项目名称" v-if="!updateFunInfo.parentProjectFunName" prop="projectName">
                <el-input v-model="updateFunInfo.projectName" :disabled="true" />
              </el-form-item>

              <el-form-item label="功能名称" prop="projectFunName">
                <el-input v-model="updateFunInfo.projectFunName" placeholder="请输入功能名称" />
              </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="updateFunInfo.show = false">取 消</el-button>
              <el-button  type="primary" v-hasPermi="['fun:demand:add']" @click="submitFunName">确 定</el-button>
            </span>
          </el-dialog>


          <!-- 添加输入项 -->
          <el-dialog
            :title="updateInputOptionInfo.title"
            :visible.sync="updateInputOptionInfo.show"
            :before-close="cancelAddInputOption"
            append-to-body
            width="30%"
          >
            <el-form ref="updateInputOptionInfo" :rules="rules" :model="updateInputOptionInfo" label-width="80px">
              <el-form-item label="要素名称" prop="name">
                <el-input v-model="updateInputOptionInfo.name" placeholder="请输入要素名称"/>
              </el-form-item>

              <el-form-item label="是否必填" prop="must">
                <el-select v-model="updateInputOptionInfo.must" placeholder="请选择是否必填">
                  <el-option
                    v-for="dict in dict.type.is_must"
                    :key="dict.value"
                    :label="dict.label"
                    :value="dict.value"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="组件类型" prop="optionComponentType">
                <el-select v-model="updateInputOptionInfo.optionComponentType" placeholder="请选择组件类型">
                  <el-option
                    v-for="dict in dict.type.input_component_type"
                    :key="dict.value"
                    :label="dict.label"
                    :value="dict.value"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="输入类型" prop="inputType">
                <el-select v-model="updateInputOptionInfo.inputType" placeholder="请选择输入类型">
                  <el-option
                    v-for="dict in dict.type.input_type"
                    :key="dict.value"
                    :label="dict.label"
                    :value="dict.value"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="可选项" prop="option">
                <el-input type="textarea" v-model="updateInputOptionInfo.option" placeholder="请输入可选项" />
              </el-form-item>
              <el-form-item label="提示" prop="optionTitle">
                <el-input type="textarea" v-model="updateInputOptionInfo.optionTitle" placeholder="请输入提示" />
              </el-form-item>
              <el-form-item label="约束" prop="inputConstraint">
                <el-input type="textarea" v-model="updateInputOptionInfo.inputConstraint" placeholder="请输入约束" />
              </el-form-item>
              <el-form-item label="备注" prop="description">
                <el-input type="textarea" v-model="updateInputOptionInfo.description" placeholder="请输入备注" />
              </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="cancelAddInputOption">取 消</el-button>
              <el-button type="primary" :icon="inputIcon" :disabled="inputDisabled" @click="submitInputOption">确 定</el-button>
            </span>
          </el-dialog>

          <!-- 添加输出项 -->
          <el-dialog
            :title="updateOutOptionInfo.title"
            :visible.sync="updateOutOptionInfo.show"
            :before-close="cancelAddOutOption"
            append-to-body
            width="30%"
          >
            <el-form ref="updateOutOptionInfo" :rules="rules1" :model="updateOutOptionInfo" label-width="80px">
              <el-form-item label="要素名称" prop="name">
                <el-input v-model="updateOutOptionInfo.name" placeholder="请输入要素名称"/>
              </el-form-item>

              <el-form-item label="输出形式" prop="optionComponentType">
                <el-select v-model="updateOutOptionInfo.optionComponentType" placeholder="请选择输出形式">
                  <el-option
                    v-for="dict in dict.type.output_component_type"
                    :key="dict.value"
                    :label="dict.label"
                    :value="dict.value"
                  ></el-option>
                </el-select>
              </el-form-item>

              <el-form-item label="备注" prop="description">
                <el-input type="textarea" v-model="updateOutOptionInfo.description" placeholder="请输入备注" />
              </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="cancelAddOutOption">取 消</el-button>
              <el-button  type="primary" :icon="outIcon" :disabled="outDisabled" @click="submitOutOption">确 定</el-button>
            </span>
          </el-dialog>


          <!-- 添加页面标题 -->
          <el-dialog
            :title="newPageInfo.title"
            :visible.sync="newPageInfo.show"
            :before-close="cancelAddPageInfo"
            append-to-body
            width="30%"
          >
            <el-form ref="updatePageInfo" :model="updatePageInfo" label-width="80px">
              <el-form-item label="页面名称" prop="pageName">
                <el-input v-model="updatePageInfo.pageName" />
              </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="cancelAddPageInfo">取 消</el-button>
              <el-button  type="primary" @click="submitPageInfo">确 定</el-button>
            </span>
          </el-dialog>


          <!-- 添加/修改角色权限 -->
          <el-dialog
            :title="updateRolePermissionData.title"
            :visible.sync="updateRolePermissionData.show"
            :before-close="cancelAddRolePermission"
            append-to-body
            width="30%"
          >
            <el-form ref="updateRolePermissionData" :rules="rulesRolePermission"  :model="updateRolePermissionData" label-width="80px">
              <el-form-item label="角色名称" prop="roleName">
                <el-input v-model="updateRolePermissionData.roleName" placeholder="请输入角色名称"/>
              </el-form-item>

              <el-form-item label="权限" prop="permissionName">
                <el-input v-model="updateRolePermissionData.permissionName" placeholder="请输入权限,示例：新增,修改,删除"/>
              </el-form-item>

              <el-form-item label="备注" prop="description">
                <el-input type="textarea" v-model="updateRolePermissionData.description" placeholder="请输入备注" />
              </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="cancelAddRolePermission">取 消</el-button>
              <el-button  type="primary" :disabled="rolePermissionDisabled" :icon="rolePermissionIcon" @click="submitRolePermission">确 定</el-button>
            </span>
          </el-dialog>


          <!-- 添加/修改业务规则步骤 -->
          <el-dialog
            :title="updatePageBusRuleData.title"
            :visible.sync="updatePageBusRuleData.show"
            :before-close="cancelAddPageBusRule"
            append-to-body
            width="30%"
          >
            <el-form ref="updatePageBusRuleData" :rules="rulesPageBusRuleData"  :model="updatePageBusRuleData" label-width="80px">
              <el-form-item label="业务规则" prop="ruleStepDesc">
                <el-input v-model="updatePageBusRuleData.ruleStepDesc" type="textarea" placeholder="请输入业务规则"/>
              </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="cancelAddPageBusRule">取 消</el-button>
              <el-button  type="primary" :icon="businessIcon" :disabled="businessDisabled" @click="submitPageBusRule">确 定</el-button>
            </span>
          </el-dialog>

          <!-- 添加/修改流程步骤 -->
          <el-dialog
            :title="updateFunProcessData.title"
            :visible.sync="updateFunProcessData.show"
            :before-close="cancelAddFunProcess"
            append-to-body
            width="30%"
          >
            <el-form ref="updateFunProcessData" :rules="rulesFunProcessData"  :model="updateFunProcessData" label-width="80px">
              <el-form-item label="流程步骤" prop="processStepDesc">
                <el-input v-model="updateFunProcessData.processStepDesc" type="textarea" placeholder="请输入流程步骤描述"/>
              </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
              <el-button @click="cancelAddFunProcess">取 消</el-button>
              <el-button type="primary" :icon="processInfoIcon" :disabled="processInfoDisabled" @click="submitFunProcess">确 定</el-button>
            </span>
          </el-dialog>


          <!-- 上传ai识图对话框 -->
          <el-dialog :title="aiOcrObj.title" :visible.sync="aiOcrObj.show" width="400px" append-to-body>
            <el-upload
              ref="aiOcr"
              :limit="1"
              accept=".png,.jpg,.jpeg,.bmp"
              :headers="aiOcrObj.headers"
              :action="aiOcrObj.url"
              :disabled="aiOcrObj.isUploading"
              :on-progress="handleFileUploadProgressAiOcr"
              :on-success="handleFileSuccessAiOcr"
              :auto-upload="false"
              :data="aiOcrData"
              drag
            >
              <i class="el-icon-upload"></i>
              <div class="el-upload__text">将图片拖到此处，或<em>点击上传</em></div>
              <div class="el-upload__tip text-center" slot="tip">
                <span>仅允许导入.png,.jpg,.jpeg,.bmp格式图片。</span>
              </div>
            </el-upload>
            <div slot="footer" class="dialog-footer">
              <el-button type="primary" :icon="aiOcrObj.btnIcon"  :disabled="aiOcrObj.btnDisabled" @click="submitAiOcr">确 定</el-button>
              <el-button @click="canclePageInputOptionByAi">取 消</el-button>
            </div>
          </el-dialog>



          <!-- 上传ai识图-输出项对话框 -->
          <el-dialog :title="aiOcrObj1.title" :visible.sync="aiOcrObj1.show" width="400px" append-to-body>
            <el-upload
              ref="aiOcr1"
              :limit="1"
              accept=".png,.jpg,.jpeg,.bmp"
              :headers="aiOcrObj1.headers"
              :action="aiOcrObj1.url"
              :disabled="aiOcrObj1.isUploading"
              :on-progress="handleFileUploadProgressAiOcr1"
              :on-success="handleFileSuccessAiOcr1"
              :auto-upload="false"
              :data="aiOcrData1"
              drag
            >
              <i class="el-icon-upload"></i>
              <div class="el-upload__text">将图片拖到此处，或<em>点击上传</em></div>
              <div class="el-upload__tip text-center" slot="tip">
                <span>仅允许导入.png,.jpg,.jpeg,.bmp格式图片。</span>
              </div>
            </el-upload>
            <div slot="footer" class="dialog-footer">
              <el-button type="primary" :icon="aiOcrObj1.btnIcon"  :disabled="aiOcrObj1.btnDisabled" @click="submitAiOcr1">确 定</el-button>
              <el-button @click="canclePageInputOptionByAi1">取 消</el-button>
            </div>
          </el-dialog>

        </div>
        </el-tab-pane>
        <el-tab-pane label="用例" name="second" class="fun-right">
          <div v-show="!pageShow">
            <el-empty description="请点击左侧树形菜单,选择子功能查看详情"></el-empty>
          </div>
          <div v-show="pageShow" style="padding-top:10px;" >
            <Point  :parentProjectNo="currentNodeData.projectNo" :parentProjectFunNo="currentNodeData.projectFunNo" />
          </div>
        </el-tab-pane>
      </el-tabs>
      </el-col>
      <!-- 导入对话框 -->
      <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
        <el-select v-model="word_import_template_config_id" placeholder="请选择导入模板" clearable>
          <el-option
            v-for="dict in dict.type.word_import_template_config"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
        <el-upload
          ref="upload"
          :limit="1"
          accept=".docx"
          :headers="upload.headers"
          :action="upload.url"
          :disabled="upload.isUploading"
          :on-progress="handleFileUploadProgress"
          :on-success="handleFileSuccess"
          :auto-upload="false"
          :data="{configValueId: word_import_template_config_id}"
          drag
        >
          <i class="el-icon-upload"></i>
          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
          <div class="el-upload__tip text-center" slot="tip">
            <span>仅允许导入docx格式文件。</span>
          </div>
        </el-upload>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitFileForm">确 定</el-button>
          <el-button @click="upload.open = false">取 消</el-button>
        </div>
      </el-dialog>
   </el-row>

  </div>
</template>

<style>
    .fun-right{
         height: calc(100vh - 180px) !important;
         width: 100%;
         overflow: auto;
    }
</style>
<style lang="sass" scoped>
  .breadcrumb-class
    ::v-deep
      .el-breadcrumb__inner
        font-size: 16px
        color: #333

  .opt-btn-class
    padding: 8px
    margin-left: 10px

  h3
    color: #333
    font-weight: 600
    margin-top: 40px


  .el-button-new
    color: #409EFF
    border: 1px solid #409EFF
    font-family: PingFangSC-Semibold
    font-size: 14px
    font-weight: 600
    border-radius: 4px
    padding: 6px 10px
    line-height: 18px

  .custom-form-item
    ::v-deep
      .el-form-item__label
        &::before
          content: ''
          display: inline-block
          width: 3px
          height: 12px
          margin-right: 4px
          background: #409EFF
          border-radius: 1px
          transform: translate(0, 1px)

  .custom-btn
    display: inline-flex
    justify-content: center
    align-items: center
    padding: 6px 10px 6px 6px
    background: #FFFFFF
    border: 1px solid rgba(64,158,255,1)
    border-radius: 4px
    cursor: pointer
    img
      margin-right: 6px
      width: 16px
      height: 16px
    span
      font-family: PingFangSC-Semibold
      font-size: 14px
      color: #409EFF
      font-weight: 600
  .fun-desc-textarea
    ::v-deep
      .el-textarea__inner,.el-input__inner
        background: #F8F8F9
        border: 1px solid rgba(223,230,236,1)
        padding: 16px 24px
        font-family: PingFangSC-Regular
        font-size: 14px
        color: #515A6E
        font-weight: 400
      .el-input__inner
        height: 52px
        line-height: 52px
  .flow-img-item
    display: flex
    flex-direction: column


  .fun-tree-class
    background: transparent
    ::v-deep
      .custom-tree-node
        width: calc(100% - 50px)
        font-size: 14px
        display: flex
        justify-content: space-between
        >span:first-child
          width: calc(100% - 50px)
          overflow: hidden
          text-overflow: ellipsis
          white-space: nowrap

        >span:last-child
          display: flex
          column-gap: 8px
      .el-tree-node__expand-icon
        color: #c0c4cc

  .head-container
    height: calc(100vh - 84px)
    overflow-y: auto
    background: #f8f8f8
    padding: 20px 16px 70px 16px
    position: relative

    .one-step-create-example
      position: absolute
      width: 86%
      bottom: 10px
      left: 50%
      transform: translate(-50%,0)
      height: 40px
      line-height: 40px
      text-align: center
      font-family: PingFangSC-Semibold
      font-size: 16px
      color: #409EFF
      font-weight: 600
      cursor: pointer
      &:hover
        border: 1px solid rgb(85, 148, 223)

      background: #FFFFFF
      border: 1px solid rgba(230,228,228,1)
      box-shadow: 0px 2px 0px 0px rgba(223,223,223,0.35)
      border-radius: 4px


  .tree-node-btn
    display: inline-flex
    flex-direction: column
    justify-content: center
    align-items: center
    padding: 1px
    border: 1px solid #e1e1e1
    border-radius: 2px
    font-size: 14px
    line-height: 19px
    float: right

  .app-container
    padding-top: 0
    padding-left: 0
    height: calc(100vh - 100px)
    margin-top: -10px

  .fun-tabs-class
    margin-top: 14px
    ::v-deep
      .el-tabs__item.is-active
        font-weight: 600

  .create-example-progress
    position: absolute

  .gray-bg
    height: 10px
    //background: #f1f1f1
    width: calc(100% + 40px)
    //background: #f1f1f1
    margin-left: -20px

</style>

<script>
import {  funTreeSelect, getFunInfoNew, updateFunNew, addFunNew , delFun, aiCreatePoint, getBatchTaskRecord, aiCreateAllPointAndCase,aiCreateAllIncrementPointAndCase, deepCopy, save, check} from "@/api/ai_smart/fun";
import Treeselect from "@riophae/vue-treeselect";
import Point  from "@/views/ai_smart/point/index";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import request from '@/utils/request'
import { delFile } from "@/api/ai_smart/file";
import { getToken } from "@/utils/auth";


import { getBatchTaskRecord as getBatchPointTaskRecord } from "@/api/ai_smart/point";
import CustomProgress from '@/views/ai_smart/fun/custom-progress.vue';
export default {
  name: "Fun",
  dicts: ['is_must', 'input_component_type','output_component_type', 'input_type', 'word_import_template_config'],
  components: {
    CustomProgress,
    Treeselect,Point
  },
  data() {
    return {
      word_import_template_config_id: "",
      aiCreateAllPoint:{
        show: true,
        percentage: 100
      },
      treeSelectNode:[],
      aiOcrObj1:{
        title: "上传",
        // 是否禁用上传
        isUploading: false,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url:process.env.VUE_APP_BASE_API + "/ai_smart/page_info/out_option/ocr",
        show: false,

        btnIcon: "",
        btnDisabled: false
      },

      aiOcrData1:{
        projectNo: null,
        projectFunNo: null,
        pageNo: null
      },

      aiOcrObj:{
        title: "上传",
        // 是否禁用上传
        isUploading: false,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + "/ai_smart/page_info/input_option/ocr",
        show: false,

        btnIcon: "",
        btnDisabled: false
      },

      aiOcrData:{
        projectNo: null,
        projectFunNo: null,
        pageNo: null
      },
      processImageText: "点击上传",
      processImageIcon: "",
      processImageDisabled: false,

      businessIcon:"",
      businessDisabled:false,

      outIcon:"",
      outDisabled: false,

      inputIcon:"",
      inputDisabled: false,

      processInfoIcon:"",
      processInfoDisabled: false,

      rolePermissionIcon: "",
      rolePermissionDisabled: false,
      currentNodeData:{},
      activeName: 'first',
      //新增编辑业务规则的数据
      updatePageBusRuleData:{
        title: "添加流程步骤",
        show: false,
        projectNo: '',
        projectFunNo: '',
        pageNo: '',
        id: '',
        ruleStepDesc: ''
      },

      //新增编辑流程步骤的数据
      updateFunProcessData:{
        title: "添加流程步骤",
        show: false,
        projectNo: '',
        projectFunNo: '',
        id: '',
        processStepDesc: ''
      },

      //新增编辑角色权限的数据
      updateRolePermissionData:{
        title: "添加角色权限",
        show: false,
        projectNo: '',
        projectFunNo: '',
        id: '',
        roleName: '',
        permissionName: '',
        description: ''
      },

      // 角色权限显示数据，做调试使用，功能开发完成后替换为后台数据
      rolePermission:[
        {
          "roleName": "客户经理",
          "permissionName": "新增,修改,删除,查看,撤回",
          "description": "",
          "id": 1
        },
        {
          "roleName": "系统管理员",
          "permissionName": "查看",
          "description": "",
          "id": 2
        },
      ],

      // 状态回显
      batchCreateBtnStatusCallBack:[
        "el-icon-video-play",
        "el-icon-loading",
        "el-icon-refresh-right",
        "el-icon-refresh-right"
      ],
      // 生成测试点进度状态获取定时器
      set_inter_val: null,
      // 生成测试点按钮状态
      batchCreateBtnStatus:{
        display: true,
        icon: 'el-icon-video-play'
      },
      // 生成测试点进度,默认为100
      batchCreateCaseRecord: 100,
      batchCreateCaseRecordTip: "",
      // 右侧加载状态
      loading: false,

      // 输入项校验规则
      rules: {
        name: [
          { required: true, message: "要素名称不能为空", trigger: "blur" }
        ],
        must: [
          { required: true, message: "请选择是否必填", trigger: "blur" }
        ],
        optionComponentType: [
          { required: true, message: "请选择组件类型", trigger: "blur" }
        ],
        inputType: [
          { required: true, message: "请选择输入类型", trigger: "blur" }
        ],

      },
      // 输出项校验规则
      rules1: {
        name: [
          { required: true, message: "要素名称不能为空", trigger: "blur" }
        ],
        optionComponentType: [
          { required: true, message: "请选择输出形式", trigger: "blur" }
        ]
      },
      // 角色权限校验规则
      rulesRolePermission:{
        roleName: [
          { required: true, message: "角色名称不能为空", trigger: "blur" }
        ],
        permissionName: [
          { required: true, message: "权限不能为空", trigger: "blur" }
        ]
      },
      // 流程步骤校验规则
      rulesFunProcessData:{
        processStepDesc: [
          { required: true, message: "流程步骤描述不能为空", trigger: "blur" }
        ]
      },
      // 业务规则校验规则
      rulesPageBusRuleData:{
        ruleStepDesc: [
          { required: true, message: "业务规则步骤描述不能为空", trigger: "blur" }
        ]
      },

      // 添加输入项,编辑输入项,信息存放对象
      updateInputOptionInfo: {
        title: "添加输入项",
        show: false,
        name: "",
        must: "",
        optionComponentType: "",
        inputType: "",
        inputConstraint: "",
        description: "",
        option: "",
        optionTitle: "",
        id: "",
        pageNo: "",
        projectNo: "",
        projectFunNo: "",
      },

      // 添加输出项,编辑输出项,信息存放对象
      updateOutOptionInfo: {
        title: "添加输出项",
        show: false,
        name: "",
        optionComponentType: "",
        description: "",
        id: "",
        pageNo: "",
        projectNo: "",
        projectFunNo: "",
      },

      // 新页面状态控制
      newPageInfo: {
        show: false,
        title: '添加页面'
      },

      // 新页面提交更新需要的数据
      updatePageInfo: {
        pageName: '',
        projectNo: '',
        projectFunNo: '',
        pageNo: ''
      },

      // 添加页面信息的按钮是否显示(状态)
      addPageBtnStatus: false,



      // 添加功能,编辑功能时,暂存的树形结构节点对象
      currentTreeNodeData: null,


      // 添加功能,编辑功能,信息存放对象
      updateFunInfo: {
        title: "添加",
        show: false,
        projectName: "",
        parentProjectFunName: "",
        projectNo: "",
        parentNo: "",

        projectFunName: "",
        projectFunNo: ""
      },

      // projectFunDetailInfo项目功能详情信息
      projectFunDetailInfo: {
        projectNo: null,
        funNo: null,
        funName: null,
        funDesc: null,
        pathNames: [],
        processImages: [],
        showImages: [],
        inputOptions: [],
        outOptions: []
      },
      // 页面是否显示,当点击叶子节点时显示,不是叶子节点不展示
      pageShow: false,

      // 输出项table
      outTableData: [],
      // 流程图路径
      src: 'https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg',
      //表单
      formData: null,

      // 左侧树形结构数据
      projectFunTreeData: null,

      defaultProps: {
        children: "children",
        label: "label"
      },

      // 项目导入参数
      upload: {
        // 是否显示弹出层（项目导入）
        open: false,
        // 弹出层标题（项目导入）
        title: "",
        // 是否禁用上传
        isUploading: false,
        // 设置上传的请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // 上传的地址
        url: process.env.VUE_APP_BASE_API + "/ai_smart/fun/import_fun_word"
      },
      isLoadingTree: false,
      treeRefreshStatus:{
        icon: "el-icon-refresh-right",
        disabled: false
      }
    };
  },
  created() {
    this.getProjectFunTree();
  },
  activated() {
    if(!this.isLoadingTree){
      this.getProjectFunTree();
    }
  }
  ,
  methods: {
    // 刷新树型结构数据
    refreshTree(){
      // el-icon-refresh-right
      this.treeRefreshStatus.icon = "el-icon-loading";
      this.treeRefreshStatus.disabled = true;
      this.isLoadingTree = true;
      funTreeSelect().then(response => {
        this.projectFunTreeData = response.data;
        this.isLoadingTree = false;
        this.treeRefreshStatus.icon = "el-icon-refresh-right";
        this.treeRefreshStatus.disabled = false;
      }).catch(res =>{
        this.isLoadingTree = false;
        this.treeRefreshStatus.icon = "el-icon-refresh-right";
        this.treeRefreshStatus.disabled = false;
      });
    },
    // 提交业务规则事件
    submitPageBusRule(){
        this.$refs["updatePageBusRuleData"].validate(valid => {
        if(valid){
            this.businessIcon = "el-icon-loading";
            this.businessDisabled = true;
            if(this.updatePageBusRuleData.id && typeof this.updatePageBusRuleData.id == "number"){
              for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
                // pageInfo.pageRuleList.len
                if(this.projectFunDetailInfo.pageInfos[i].pageNo == this.updatePageBusRuleData.pageNo){
                  for(let j = 0; j < this.projectFunDetailInfo.pageInfos[i].pageRuleList.length; j++){
                    if(this.updatePageBusRuleData.id == this.projectFunDetailInfo.pageInfos[i].pageRuleList[j].id){
                      this.projectFunDetailInfo.pageInfos[i].pageRuleList[j].ruleStepDesc = this.updatePageBusRuleData.ruleStepDesc;
                      if(typeof this.updatePageBusRuleData.id == "number"){
                        this.projectFunDetailInfo.pageInfos[i].pageRuleList[j].isChange = 1;
                      }else{
                        this.projectFunDetailInfo.pageInfos[i].pageRuleList[j].isChange = 2;
                      }
                    }
                  }
                }
              }
              this.businessIcon = "";
              this.businessDisabled = false;

            }else{
             let isExists = false;
             for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
                if(this.projectFunDetailInfo.pageInfos[i].pageNo == this.updatePageBusRuleData.pageNo){
                  for(let j = 0; j < this.projectFunDetailInfo.pageInfos[i].pageRuleList.length; j++){
                    if(this.updatePageBusRuleData.id == this.projectFunDetailInfo.pageInfos[i].pageRuleList[j].id){
                      this.projectFunDetailInfo.pageInfos[i].pageRuleList[j].ruleStepDesc = this.updatePageBusRuleData.ruleStepDesc;
                      isExists = true;
                      this.projectFunDetailInfo.pageInfos[i].pageRuleList[j].isChange = 2;
                      break;
                    }
                  }
                }
              }

              if(!isExists){
                for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
                  if(this.projectFunDetailInfo.pageInfos[i].pageNo == this.updatePageBusRuleData.pageNo){
                      const data = {
                        projectNo: this.updatePageBusRuleData.projectNo,
                        projectFunNo: this.updatePageBusRuleData.projectFunNo,
                        pageNo: this.updatePageBusRuleData.pageNo,
                        id: "t_"+new Date().getTime(),
                        ruleStepDesc: this.updatePageBusRuleData.ruleStepDesc,
                        isChange: 2,
                        ruleCaseNum: 0
                      };
                      this.projectFunDetailInfo.pageInfos[i].pageRuleList.push(data);
                  }
                }
              }

              this.businessIcon = "";
              this.businessDisabled = false;
            }

            this.cancelAddPageBusRule();
        }
      });
    },

    // 删除单个业务规则事件
    delPageBusRule(id, pageNo){
      this.$modal.confirm('是否确认删除？').then(() =>{
        for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
          if(this.projectFunDetailInfo.pageInfos[i].pageNo == pageNo){
            for(let j = 0; j < this.projectFunDetailInfo.pageInfos[i].pageRuleList.length; j++){
              if(id == this.projectFunDetailInfo.pageInfos[i].pageRuleList[j].id){
                this.projectFunDetailInfo.pageInfos[i].pageRuleList.splice(j, 1);
                break;
              }
            }
          }
        }

      }).catch(() => {});


    },
    delPageBusRules(pageNo){

      this.$modal.confirm('是否确认删除？').then(() =>{

        for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
          if(this.projectFunDetailInfo.pageInfos[i].pageNo == pageNo){
            this.projectFunDetailInfo.pageInfos[i].pageRuleList = [];
            break;
          }
        }
        }).catch(() => {});
    },

    // 编辑业务规则事件
    updatePageBusRules(pageInfo){
        this.updatePageBusRuleData = {
          title: "修改业务规则",
          show: true,
          projectNo: pageInfo.projectNo,
          projectFunNo: pageInfo.projectFunNo,
          pageNo: pageInfo.pageNo,
          id: pageInfo.id ,
          ruleStepDesc:pageInfo.ruleStepDesc
      }
    },
    // 添加业务规则事件
    addPageBusRules(pageInfo){
        this.updatePageBusRuleData = {
        title: "添加业务规则",
        show: true,
        projectNo: pageInfo.projectNo,
        projectFunNo: pageInfo.projectFunNo,
        pageNo: pageInfo.pageNo,
        id: 't_'+new Date().getTime(),
        ruleStepDesc: ''
      }
    },

    // 取消添加/编辑 业务规则事件
    cancelAddPageBusRule(){
        this.updatePageBusRuleData = {
        title: "添加流程步骤",
        show: false,
        projectNo: '',
        projectFunNo: '',
        pageNo: '',
        id: '',
        ruleStepDesc: ''
      }
    },

    // 删除流程步骤事件
    delFunProcessInfo(id){
        this.$modal.confirm('是否确认删除？').then(() =>{
          for(let i = 0; i < this.projectFunDetailInfo.processInfoList.length; i++){
          if(this.projectFunDetailInfo.processInfoList[i].id == id){
            this.projectFunDetailInfo.processInfoList.splice(i, 1);
            break;
          }
        }
        }).catch(() => {});

    },
    // 编辑流程步骤事件
    updateFunProcessInfo(row){
      this.updateFunProcessData = {
        title: "修改流程步骤",
        show: true,
        projectNo: row.projectNo,
        projectFunNo: row.projectFunNo,
        id: row.id,
        processStepDesc: row.processStepDesc
      }
    },
    // 添加流程步骤事件
    addFunProcessInfo(row){
      this.updateFunProcessData = {
        title: "添加流程步骤",
        show: true,
        projectNo: row.projectNo,
        projectFunNo: row.funNo,
        id: "t_"+new Date().getTime(),
        processStepDesc: ""
      }
    },

    // 提交流程步骤事件
    submitFunProcess(){
      this.$refs["updateFunProcessData"].validate(valid => {
        if(valid){
            this.processInfoIcon = "el-icon-loading";
            this.processInfoDisabled = true;
            if(this.updateFunProcessData.id && typeof this.updateFunProcessData.id == "number"){
              for(let i = 0; i < this.projectFunDetailInfo.processInfoList.length; i++){
                if(this.projectFunDetailInfo.processInfoList[i].id == this.updateFunProcessData.id){
                  this.projectFunDetailInfo.processInfoList[i].processStepDesc = this.updateFunProcessData.processStepDesc;
                  this.projectFunDetailInfo.processInfoList[i].isChange = 1;
                  break;
                }
              }
              this.processInfoIcon = "";
              this.processInfoDisabled = false;

            }else{
              let isExists = false;
              for(let i = 0; i < this.projectFunDetailInfo.processInfoList.length; i++){
                if(this.projectFunDetailInfo.processInfoList[i].id == this.updateFunProcessData.id){
                  this.projectFunDetailInfo.processInfoList[i].processStepDesc = this.updateFunProcessData.processStepDesc;
                  isExists = true;
                  this.projectFunDetailInfo.processInfoList[i].isChange = 2;
                  break;
                }
              }
              if(!isExists){
                const data = {
                  id: this.updateFunProcessData.id,
                  projectNo: this.updateFunProcessData.projectNo,
                  projectFunNo: this.updateFunProcessData.projectFunNo,
                  processStepDesc: this.updateFunProcessData.processStepDesc,
                  isChange: 2
                };
                this.projectFunDetailInfo.processInfoList.push(data);
              }

              this.processInfoIcon = "";
              this.processInfoDisabled = false;
            }

            this.cancelAddFunProcess();
        }
      });
    },

    // 取消流程步骤事件
    cancelAddFunProcess(){
      this.updateFunProcessData = {
        title: "添加流程步骤",
        show: false,
        projectNo: '',
        projectFunNo: '',
        id: '',
        processStepDesc: ''
      }
    },

    // 删除功能权限
    delRolePermission(id){
      this.$modal.confirm('是否确认删除？').then(() =>{
        for(let i = 0; i < this.projectFunDetailInfo.rolePermissionList.length; i++){
          if(this.projectFunDetailInfo.rolePermissionList[i].id == id){
            this.projectFunDetailInfo.rolePermissionList.splice(i, 1);
            console.log(this.projectFunDetailInfo.rolePermissionList);
            break;
          }
        }
      }).catch(() => {});
    },
    // 提交功能权限
    submitRolePermission(){
      this.$refs["updateRolePermissionData"].validate(valid => {
        if(valid){
            this.rolePermissionIcon = "el-icon-loading";
            this.rolePermissionDisabled = true;
            if(this.updateRolePermissionData.id && typeof this.updateRolePermissionData.id == "number" ){

              for(let i = 0; i < this.projectFunDetailInfo.rolePermissionList.length; i++){
                if(this.projectFunDetailInfo.rolePermissionList[i].id == this.updateRolePermissionData.id){
                  this.projectFunDetailInfo.rolePermissionList[i].roleName = this.updateRolePermissionData.roleName;
                  this.projectFunDetailInfo.rolePermissionList[i].permissionName = this.updateRolePermissionData.permissionName;
                  this.projectFunDetailInfo.rolePermissionList[i].description = this.updateRolePermissionData.description;
                  this.projectFunDetailInfo.rolePermissionList[i].isChange = 1;
                  break;
                }

              }
              this.rolePermissionIcon = "";
              this.rolePermissionDisabled = false;
            }else{
             let isExists = false;
             for(let i = 0; i < this.projectFunDetailInfo.rolePermissionList.length; i++){
                if(this.projectFunDetailInfo.rolePermissionList[i].id == this.updateRolePermissionData.id){
                  isExists = true;
                  this.projectFunDetailInfo.rolePermissionList[i].roleName = this.updateRolePermissionData.roleName;
                  this.projectFunDetailInfo.rolePermissionList[i].permissionName = this.updateRolePermissionData.permissionName;
                  this.projectFunDetailInfo.rolePermissionList[i].description = this.updateRolePermissionData.description;
                  if(typeof this.updateRolePermissionData.id == "number"){
                    this.projectFunDetailInfo.rolePermissionList[i].isChange = 1;
                  }else{
                    this.projectFunDetailInfo.rolePermissionList[i].isChange = 2;
                  }

                  break;
                }

              }
              if(!isExists){
                const data = {
                  id: this.updateRolePermissionData.id,
                  roleName: this.updateRolePermissionData.roleName,
                  permissionName: this.updateRolePermissionData.permissionName,
                  description: this.updateRolePermissionData.description,
                  projectNo: this.updateRolePermissionData.projectNo,
                  projectFunNo: this.updateRolePermissionData.projectFunNo,
                  isChange: 2
                };
                this.projectFunDetailInfo.rolePermissionList.push(data);
              }
              this.rolePermissionIcon = "";
              this.rolePermissionDisabled = false;
            }
            this.updateRolePermissionData.show = false;
        }
      });
    },

    // 添加功能权限
    addRolePermission(row){
      this.updateRolePermissionData.title = "添加功能权限";
      this.updateRolePermissionData.show = true;
      this.updateRolePermissionData.projectNo = row.projectNo;
      this.updateRolePermissionData.projectFunNo = row.funNo;
      this.updateRolePermissionData.id = "t_"+new Date().getTime();
      this.updateRolePermissionData.roleName = "";
      this.updateRolePermissionData.permissionName = "";
      this.updateRolePermissionData.description = "";
    },

    // 编辑功能权限
    updateRolePermission(row){
      this.updateRolePermissionData.title = "编辑功能权限";
      this.updateRolePermissionData.show = true;
      this.updateRolePermissionData.projectNo = row.projectNo;
      this.updateRolePermissionData.projectFunNo = row.projectFunNo;
      this.updateRolePermissionData.id = row.id;
      this.updateRolePermissionData.roleName = row.roleName;
      this.updateRolePermissionData.permissionName = row.permissionName;
      this.updateRolePermissionData.description = row.description;
    },




    // 关闭功能权限新增编辑窗口
    cancelAddRolePermission(){
        this.updateRolePermissionData={
        title: "添加角色权限",
        show: false,
        projectNo: '',
        projectFunNo: '',
        id: '',
        roleName: '',
        permissionName: '',
        description: ''
      }
    },

    // 查看测试点
    showTestPoint(row){
      const query = {
        projectFunNo: row.funNo,
        projectNo: row.projectNo
      };
      const path = "/ai_smart/point";
      this.$router.push({ path: path, query: query });
    },

    // 查看用例
    showTestPointAndCase(projectNo, funNo, type, typeId){
      const query = {
        projectFunNo: funNo,
        projectNo: projectNo,
        fromFunDetail: 1,
        type: type,
        typeId: typeId
      };
      const path = "/ai_smart/point";
      this.$router.push({ path: path, query: query });
    },

    // 生成测试点获取生成进度
    getBatchTaskRecordInfo(){
      this.batchCreateCaseRecordTip = "生成中";
      this.set_inter_val = setInterval(() => {
          getBatchTaskRecord().then(response => {
                this.batchCreateCaseRecord = parseFloat(((response.data.errorNum + response.data.successNum) * 100 / response.data.totalNum).toFixed(2));
                if(this.batchCreateCaseRecord >= 100){
                  clearInterval(this.set_inter_val);
                  this.set_inter_val = null;
                  this.batchCreateBtnStatus.display = false;
                  this.batchCreateBtnStatus.icon = 'el-icon-video-play';
                  if(!this.is_first_into){
                    this.$modal.alertWarning("功能测试点生成完成");
                  }

                }
          });
      }, 500)
    },

    getBatchTaskRecordInfo_(){
      this.batchCreateCaseRecordTip = "正在生成:";
      this.set_inter_val = setInterval(() => {
          getBatchTaskRecord().then(response => {
                this.batchCreateCaseRecord = parseFloat(((response.data.errorNum + response.data.successNum) * 100 / response.data.totalNum).toFixed(2));
                if(this.batchCreateCaseRecord >= 100){
                  clearInterval(this.set_inter_val);
                  this.set_inter_val = null;
                  //生成完成,清空tip，不展示进度条
                  this.batchCreateCaseRecordTip = "";
                  this.batchCreateBtnStatus.display = false;
                  this.batchCreateBtnStatus.icon = 'el-icon-video-play';
                  if(!this.is_first_into){
                    // 测试点进度完成，获取用例生成进度
                    // this.getBatchPointTaskRecordInfo();
                  }
                }
          }).catch(()=>{
            clearInterval(this.set_inter_val);
            this.set_inter_val = null;
            this.batchCreateCaseRecord = 100;
          });
      }, 500)
    },
    format_(percentage){
      return this.batchCreateCaseRecordTip  + this.batchCreateCaseRecord + "%";
    },

    // getBatchPointTaskRecord

    getBatchPointTaskRecordInfo(){
      this.batchCreateCaseRecordTip = "正在生成用例:";
      this.set_inter_val = setInterval(() => {
          getBatchPointTaskRecord().then(response => {
                this.batchCreateCaseRecord = parseFloat(((response.data.errorNum + response.data.successNum) * 100 / response.data.totalNum).toFixed(2));
                if(this.batchCreateCaseRecord >= 100){
                  clearInterval(this.set_inter_val);
                  this.set_inter_val = null;
                  //生成完成,清空tip，不展示进度条
                  this.batchCreateCaseRecordTip = "";
                  this.batchCreateBtnStatus.display = false;
                  this.batchCreateBtnStatus.icon = 'el-icon-video-play';
                  this.$modal.alertWarning("生成完成");

                }
          }).catch(()=>{
            clearInterval(this.set_inter_val);
            this.set_inter_val = null;
            this.batchCreateCaseRecord = 100;
          });
      }, 500)
    },

    // 点击生成测试点按钮事件
    handleAiCreateAllPoint(funNo){
        this.batchCreateCaseRecord = 0;
        this.batchCreateBtnStatus.display = true;
        this.batchCreateBtnStatus.icon = 'el-icon-loading';
        aiCreatePoint({ids: [funNo]}).then(res => {
          this.$modal.msgSuccess(res.msg);
          this.getBatchTaskRecordInfo();
        });
    },

    handleAiCreateAllPoint_(funNo){
        this.$confirm('是否生成测试点(会覆盖已有数据)', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(()=>{
          this.batchCreateCaseRecord = 0;
          this.batchCreateBtnStatus.display = true;
          this.batchCreateBtnStatus.icon = 'el-icon-loading';
          aiCreatePoint({ids: [funNo]}).then(res => {
            this.$modal.msgSuccess(res.msg);
            this.getBatchTaskRecordInfo();
          });
        });


    },




    // 输入项提交事件
    submitOutOption(){
      this.$refs["updateOutOptionInfo"].validate(valid => {
        if(valid){
            this.outIcon = "el-icon-loading";
            this.outDisabled = true;

            let isExists = false;
            for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
              if(this.projectFunDetailInfo.pageInfos[i].pageNo ==this.updateOutOptionInfo.pageNo){
                for(let j = 0; j < this.projectFunDetailInfo.pageInfos[i].outOptions.length; j++){
                  if(this.projectFunDetailInfo.pageInfos[i].outOptions[j].id == this.updateOutOptionInfo.id){
                    this.projectFunDetailInfo.pageInfos[i].outOptions[j].pageNo = this.updateOutOptionInfo.pageNo;
                    this.projectFunDetailInfo.pageInfos[i].outOptions[j].projectNo = this.updateOutOptionInfo.projectNo;
                    this.projectFunDetailInfo.pageInfos[i].outOptions[j].projectFunNo = this.updateOutOptionInfo.projectFunNo;
                    this.projectFunDetailInfo.pageInfos[i].outOptions[j].name = this.updateOutOptionInfo.name;
                    this.projectFunDetailInfo.pageInfos[i].outOptions[j].optionComponentType = this.updateOutOptionInfo.optionComponentType;
                    this.projectFunDetailInfo.pageInfos[i].outOptions[j].description = this.updateOutOptionInfo.description;
                    if(typeof this.updateOutOptionInfo.id == "number"){
                      this.projectFunDetailInfo.pageInfos[i].outOptions[j].isChange = 1;
                    }else{
                      this.projectFunDetailInfo.pageInfos[i].outOptions[j].isChange = 2;
                    }
                    isExists = true;
                    break;
                  }
                }
              }
            }

            if(!isExists){
              const data = {
                id: this.updateOutOptionInfo.id,
                pageNo: this.updateOutOptionInfo.pageNo,
                projectNo: this.updateOutOptionInfo.projectNo,
                projectFunNo: this.updateOutOptionInfo.projectFunNo,
                name: this.updateOutOptionInfo.name,
                optionComponentType: this.updateOutOptionInfo.optionComponentType,
                description: this.updateOutOptionInfo.description,
                outOptionCaseNum: 0,
                isChange: 2
              };

              for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
                if(this.projectFunDetailInfo.pageInfos[i].pageNo ==this.updateOutOptionInfo.pageNo){
                  this.projectFunDetailInfo.pageInfos[i].outOptions.push(data);
                  break;
                }
              }

            }
            this.outIcon = "";
            this.outDisabled = false;
            this.cancelAddOutOption();
        }
      });

    },

    // 输入项提交事件
    submitInputOption(){
      this.$refs["updateInputOptionInfo"].validate(valid => {
        if(valid){
            this.inputIcon = "el-icon-loading";
            this.inputDisabled = true;
            let isExists = false;
            for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
              if(this.updateInputOptionInfo.pageNo == this.projectFunDetailInfo.pageInfos[i].pageNo){
                for(let j = 0; j < this.projectFunDetailInfo.pageInfos[i].inputOptions.length; j++){
                  if(this.projectFunDetailInfo.pageInfos[i].inputOptions[j].id == this.updateInputOptionInfo.id){
                    this.projectFunDetailInfo.pageInfos[i].inputOptions[j].name = this.updateInputOptionInfo.name;
                    this.projectFunDetailInfo.pageInfos[i].inputOptions[j].must = this.updateInputOptionInfo.must;
                    this.projectFunDetailInfo.pageInfos[i].inputOptions[j].optionComponentType = this.updateInputOptionInfo.optionComponentType;
                    this.projectFunDetailInfo.pageInfos[i].inputOptions[j].inputType = this.updateInputOptionInfo.inputType;
                    this.projectFunDetailInfo.pageInfos[i].inputOptions[j].inputConstraint = this.updateInputOptionInfo.inputConstraint;
                    this.projectFunDetailInfo.pageInfos[i].inputOptions[j].description = this.updateInputOptionInfo.description;
                    this.projectFunDetailInfo.pageInfos[i].inputOptions[j].option = this.updateInputOptionInfo.option;
                    this.projectFunDetailInfo.pageInfos[i].inputOptions[j].optionTitle = this.updateInputOptionInfo.optionTitle;
                    isExists = true;
                    if(typeof this.updateInputOptionInfo.id == "number"){
                      this.projectFunDetailInfo.pageInfos[i].inputOptions[j].isChange = 1;
                    }else{
                      this.projectFunDetailInfo.pageInfos[i].inputOptions[j].isChange = 2;
                    }
                    break;
                  }
                }
              }
            }

            if(!isExists){
              for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
                if(this.updateInputOptionInfo.pageNo == this.projectFunDetailInfo.pageInfos[i].pageNo){
                    const data = {
                      id: this.updateInputOptionInfo.id,
                      pageNo: this.updateInputOptionInfo.pageNo,
                      projectNo: this.updateInputOptionInfo.projectNo,
                      projectFunNo: this.updateInputOptionInfo.projectFunNo,
                      name: this.updateInputOptionInfo.name,
                      must: this.updateInputOptionInfo.must,
                      optionComponentType: this.updateInputOptionInfo.optionComponentType,
                      inputType: this.updateInputOptionInfo.inputType,
                      inputConstraint: this.updateInputOptionInfo.inputConstraint,
                      description: this.updateInputOptionInfo.description,
                      option: this.updateInputOptionInfo.option,
                      optionTitle: this.updateInputOptionInfo.optionTitle,
                      inputOptionCaseNum: 0,
                      isChange: 2
                    };
                    this.projectFunDetailInfo.pageInfos[i].inputOptions.push(data);
                    break;
                }
              }
            }

            this.inputIcon = "";
            this.inputDisabled = false;
            this.cancelAddInputOption();
        }
      });

    },

    // 取消添加输出项事件
    cancelAddOutOption(){
      this.updateOutOptionInfo={
        title: "添加输出项",
        show: false,
        name: "",
        optionComponentType: "",
        description: "",
        id: "",
        pageNo: "",
        projectNo: "",
        projectFunNo: "",
      }
      this.outIcon = "";
      this.outDisabled = false;
    },

    // 取消添加输入项事件
    cancelAddInputOption(){
      this.updateInputOptionInfo = {
        title: "添加",
        show: false,
        name: "",
        must: "",
        optionComponentType: "",
        inputType: "",
        inputConstraint: "",
        description: "",
        option: "",
        optionTitle: "",
        id: "",
        pageNo: "",
        projectNo: "",
        projectFunNo: "",
      }
      this.inputIcon = "";
      this.inputDisabled = false;
    },

    // 添加输入项事件
    addPageInputOption(pageInfo){
       this.updateInputOptionInfo.title = "添加输入项";
       this.updateInputOptionInfo.show = true;
       this.updateInputOptionInfo.projectNo = pageInfo.projectNo;
       this.updateInputOptionInfo.projectFunNo = pageInfo.projectFunNo;
       this.updateInputOptionInfo.pageNo = pageInfo.pageNo;
       this.updateInputOptionInfo.id = "t_"+new Date().getTime();
    },
    // 添加ai识图
    addPageInputOptionByAi(pageInfo){
      this.aiOcrObj.title = "上传";
      this.aiOcrObj.show = true;

      this.aiOcrData.projectNo = pageInfo.projectNo;
      this.aiOcrData.projectFunNo = pageInfo.projectFunNo;
      this.aiOcrData.pageNo = pageInfo.pageNo;

      this.aiOcrObj.btnDisabled = false;
      this.aiOcrObj.btnIcon = "";

    },

    // 取消ai识图
    canclePageInputOptionByAi(){
      this.aiOcrObj.title = "";
      this.aiOcrObj.show = false;

      this.aiOcrData.projectNo = null;
      this.aiOcrData.projectFunNo = null;
      this.aiOcrData.pageNo = null;

      this.aiOcrObj.btnDisabled = false;
      this.aiOcrObj.btnIcon = "";
    },

     // 提交ai识图文件
    submitAiOcr() {
      this.aiOcrObj.btnDisabled = true;
      this.aiOcrObj.btnIcon = "el-icon-loading";
      this.$refs.aiOcr.submit();
    },
    // 文件上传中处理
    handleFileUploadProgressAiOcr(event, file, fileList) {
      this.aiOcrObj.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccessAiOcr(response, file, fileList) {
      this.aiOcrObj.show = false;
      this.aiOcrObj.isUploading = false;
      this.$refs.aiOcr.clearFiles();
      this.$modal.msgSuccess("操作成功");
      this.aiOcrObj.btnDisabled = false;
      this.aiOcrObj.btnIcon = "";
      getFunInfoNew(this.projectFunDetailInfo.funNo).then(response => {
              this.projectFunDetailInfo = response.data;
      });
    },


    // 添加ai识图(输出项)
    // 添加ai识图
    addPageInputOptionByAi1(pageInfo){
      this.aiOcrObj1.title = "上传";
      this.aiOcrObj1.show = true;

      this.aiOcrData1.projectNo = pageInfo.projectNo;
      this.aiOcrData1.projectFunNo = pageInfo.projectFunNo;
      this.aiOcrData1.pageNo = pageInfo.pageNo;

      this.aiOcrObj1.btnDisabled = false;
      this.aiOcrObj1.btnIcon = "";

    },

    // 取消ai识图
    canclePageInputOptionByAi1(){
      this.aiOcrObj1.title = "";
      this.aiOcrObj1.show = false;

      this.aiOcrData1.projectNo = null;
      this.aiOcrData1.projectFunNo = null;
      this.aiOcrData1.pageNo = null;

      this.aiOcrObj1.btnDisabled = false;
      this.aiOcrObj1.btnIcon = "";
    },

     // 提交ai识图文件
    submitAiOcr1() {
      this.aiOcrObj1.btnDisabled = true;
      this.aiOcrObj1.btnIcon = "el-icon-loading";
      this.$refs.aiOcr1.submit();
    },
    // 文件上传中处理
    handleFileUploadProgressAiOcr1(event, file, fileList) {
      this.aiOcrObj1.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccessAiOcr1(response, file, fileList) {
      this.aiOcrObj1.show = false;
      this.aiOcrObj1.isUploading = false;
      this.$refs.aiOcr1.clearFiles();
      this.$modal.msgSuccess("操作成功");
      this.aiOcrObj1.btnDisabled = false;
      this.aiOcrObj1.btnIcon = "";
      getFunInfoNew(this.projectFunDetailInfo.funNo).then(response => {
              this.projectFunDetailInfo = response.data;
      });
    },


    // 输出项单项 删除事件
    delPageOutOption(id,pageNo){

      this.$modal.confirm('是否确认删除？').then(() =>{
        for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
          if(this.projectFunDetailInfo.pageInfos[i].pageNo == pageNo){
            for(let j = 0; j < this.projectFunDetailInfo.pageInfos[i].outOptions.length; j++){
              if(this.projectFunDetailInfo.pageInfos[i].outOptions[j].id == id){
                this.projectFunDetailInfo.pageInfos[i].outOptions.splice(j,1);
                break;
              }
            }
          }
        }

      }).catch(() => {});

    },

    // 添加输出项事件
    addPageOutOption(pageInfo){
       this.updateOutOptionInfo.title = "添加输出项";
       this.updateOutOptionInfo.show = true;
       this.updateOutOptionInfo.projectNo = pageInfo.projectNo;
       this.updateOutOptionInfo.projectFunNo = pageInfo.projectFunNo;
       this.updateOutOptionInfo.pageNo = pageInfo.pageNo;
       this.updateOutOptionInfo.id = "t_"+new Date().getTime();
    },

    // 输入项批量删除事件
    delPageOutOptions(pageNo){

        this.$modal.confirm('是否确认删除？').then(() =>{
          for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
          if(this.projectFunDetailInfo.pageInfos[i].pageNo == pageNo){
            this.projectFunDetailInfo.pageInfos[i].outOptions = [];
          }
        }

        }).catch(() => {});

    },


    // 输入项批量删除事件
    delPageInputOptions(pageNo){

          this.$modal.confirm('是否确认删除？').then(() =>{


            for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
              if(this.projectFunDetailInfo.pageInfos[i].pageNo == pageNo){

                this.projectFunDetailInfo.pageInfos[i].inputOptions = [];
                break;

              }
            }




          }).catch(() => {});

    },

    // 修改输出项事件
    updatePageOutOption(row){
      this.updateOutOptionInfo = {
        title: "修改输出项",
        show: true,
        name: row.name,
        optionComponentType: row.optionComponentType,
        description: row.description,
        id: row.id,
        pageNo: row.pageNo,
        projectNo: row.projectNo,
        projectFunNo: row.projectFunNo,
      }
    },
    // 修改输入项事件
    updatePageInputOption(row){
      this.updateInputOptionInfo = {
        title: "修改输入项",
        show: true,
        name: row.name,
        must: row.must,
        optionComponentType: row.optionComponentType,
        inputType: row.inputType,
        inputConstraint: row.inputConstraint,
        description: row.description,
        option: row.option,
        optionTitle: row.optionTitle,
        id: row.id,
        pageNo: row.pageNo,
        projectNo: row.projectNo,
        projectFunNo: row.projectFunNo,
      }
    },
    // 输入项单项 删除事件
    delPageInputOption(id, pageNo){

      this.$modal.confirm('是否确认删除？').then(() =>{
        for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
          if(this.projectFunDetailInfo.pageInfos[i].pageNo == pageNo){
            for(let j = 0; j < this.projectFunDetailInfo.pageInfos[i].inputOptions.length; j++){
              if(this.projectFunDetailInfo.pageInfos[i].inputOptions[j].id == id){
                this.projectFunDetailInfo.pageInfos[i].inputOptions.splice(j,1);
                break;
              }
            }
          }
        }

      }).catch(() => {});

    },

     // 修改页面名称
    updatePageName(pageInfo){
      pageInfo.isChange = 1;
    },

    // 点击页面名称后面的 删除链接事件
    delPageInfo(pageNo){
      this.$modal.confirm('是否确认删除？').then(() =>{
        for(let i = 0; i < this.projectFunDetailInfo.pageInfos.length; i++){
          if(this.projectFunDetailInfo.pageInfos[i].pageNo == pageNo){
            this.projectFunDetailInfo.pageInfos.splice(i, 1);
            break;
          }
        }

      }).catch(() => {});

    },

    // 点击添加页面 提交按钮事件
    submitPageInfo(){
      const pageInfo = {
        pageName: this.updatePageInfo.pageName,
        projectNo: this.updatePageInfo.projectNo,
        projectFunNo: this.updatePageInfo.projectFunNo,
        pageNo: this.updatePageInfo.pageNo,
        isChange: 2,
        pageRuleList: [],
        inputOptions: [],
        outOptions: []
      };
      this.projectFunDetailInfo.pageInfos.push(pageInfo);
      this.cancelAddPageInfo();
    },

    // 点击添加页面 取消按钮事件
    cancelAddPageInfo(){
      this.newPageInfo.show = false;
      this.newPageInfo.title = "";

      this.updatePageInfo.projectNo = '';
      this.updatePageInfo.projectFunNo = '';
      this.updatePageInfo.pageName = '';
      this.updatePageInfo.pageNo = '';
    },

    // 点击添加页面按钮事件
    addPageInfo(projectNo, funNo){
      this.newPageInfo.show = true;
      this.newPageInfo.title = "添加页面";

      this.updatePageInfo.projectNo = projectNo;
      this.updatePageInfo.projectFunNo = funNo;
      this.updatePageInfo.pageNo = "t_"+new Date().getTime();
    },


    // 节点单击事件
    handleNodeClick(data) {
      this.currentNodeData = data;
      if(data.type == "FUN" && data.isLeaf==1){
        this.pageShow = true;
      }else{
        this.pageShow = false;
        return ;
      }
      this.loading = true;
      // 获取项目详情信息，设置到变量projectFunDetailInfo
      this.projectFunDetailInfo= {
        projectNo: null,
        funNo: null,
        funName: null,
        funDesc: null,
        pathNames: [],
        processImages: [],
        showImages: [],
        inputOptions: [],
        outOptions: []
      };
      getFunInfoNew(data.projectFunNo).then(response => {
        this.projectFunDetailInfo = response.data;
        this.loading = false;
      }).catch(res => {
        this.loading = false;
      });
    },
    //查询功能下拉树结构
    getProjectFunTree() {
      this.isLoadingTree = true;
      funTreeSelect().then(response => {
        this.projectFunTreeData = response.data;
        this.isLoadingTree = false;
      }).catch(res =>{
        this.isLoadingTree = false;
      });
    },

    // 左侧树形结构，右侧添加，删除按钮渲染
    renderContent(h, { node, data, store }) {
        return (
          <span class="custom-tree-node">
            <span>{node.label}</span>
            <span>
              <el-link on-click={ ($event) => this.append($event,data) }   type="primary"><i class="el-icon-plus"></i></el-link>
              <el-link on-click={ ($event) => this.remove($event,node,data) } type="primary"><i class="el-icon-close"></i></el-link>
            </span>
          </span>

          );
    },
    // 左侧树形结构,添加按钮
    append(event, data) {
        // const newChild = { id: id++, label: 'testtest', children: [] };
        // if (!data.children) {
        //   this.$set(data, 'children', []);
        // }
        // data.children.push(newChild);
        this.updateFunInfo.show = true;
        this.updateFunInfo.title = "添加";
        this.projectName = data.projectName;

        if(data.type == "PROJECT"){
          this.updateFunInfo.projectName = data.label;
          this.updateFunInfo.parentProjectFunName = "";
          this.updateFunInfo.parentNo = "";
          this.updateFunInfo.projectNo = data.id;
        }else{
          this.updateFunInfo.projectName = data.projectName;
          this.updateFunInfo.parentProjectFunName = data.label;
          this.updateFunInfo.parentNo = data.id;
          this.updateFunInfo.projectNo = data.projectNo;
        }
        this.currentTreeNodeData = data;



    },
    // 左侧树形结构,删除按钮
    remove(event, node, data) {
      event.stopPropagation();
        if(data.type == "PROJECT"){
          this.$message({
            type: 'warning',
            message: '不能删除项目'
          });
          return false;
        }


        this.$confirm('是否删除该功能['+data.label+']?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(res => {
          const parent = node.parent;
          const children = parent.data.children || parent.data;
          const index = children.findIndex(d => d.id === data.id);
          delFun([data.id]).then(res => {
            children.splice(index, 1);
            if(children.length <= 0){
              parent.data.isLeaf = 1;
              this.pageShow = false;
            }
          });
        }).catch(() => {

        });







    },
    // 鼠标移入节点上时,显示删除和添加按钮
    node_hover(node, data){
      data.hover = true;
    },
    // 处理添加，编辑项目名称弹出框点击关闭按钮的事件
    handleClose(){
      this.updateFunInfo.show = false;
    },


    // 提交项目功能名称信息
    submitFunName(){
      this.$refs["updateFunInfo"].validate(valid => {
        if (valid) {
          if (this.updateFunInfo.projectFunNo) {
            updateFunNew(this.updateFunInfo).then(response => {
              this.updateFunInfo.show = false;
              this.currentTreeNodeData.label = this.updateFunInfo.projectFunName;
            });
          } else {
            addFunNew(this.updateFunInfo).then(response => {
              this.updateFunInfo.show = false;

              const newChild = response.data;
              if (!this.currentTreeNodeData.children) {
                this.$set(this.currentTreeNodeData, 'children', []);
              }
              this.currentTreeNodeData.children.push(newChild);
              this.currentTreeNodeData.isLeaf = 0;
            });
          }
        }
      });
    },

    // 更新功能描述
    updateFunDesc(){
       const data = {
          projectNo: this.projectFunDetailInfo.projectNo,
          projectFunNo: this.projectFunDetailInfo.funNo,
          projectFunDesc: this.projectFunDetailInfo.funDesc,
       };
       this.projectFunDetailInfo.isChange = 1;
    },

    // 上传流程图
    tempProcessFileUpload(option){
      var  data = new  FormData()//自定义 参数类型必须为 FormData格式 此为强制要求
      data.append("file",option.file)
      data.append("busNo",this.projectFunDetailInfo.funNo);
      data.append("busType","FUN_PROCESS")
      this.importProcessCommit(data,option)
    },
    importProcessCommit(data,option){
      const header = option.headers;
      header["Content-Type"] = "application/x-www-form-urlencoded";
      // { 'Content-Type': 'application/x-www-form-urlencoded' },

      this.processImageText = "上传中...";
      this.processImageIcon = "el-icon-loading";
      this.processImageDisabled = true;
      request({
        url: "/ai_smart/file/upload",//取自el-upload标签的action中配置，或者也可以在这里直接写url
        method:"post",
        data:data,
        processData:false,
        contentType:false,

        headers: header,//同理
        responseType: "json",
      }).then(res => {
          this.processImageText = "点击上传";
          this.processImageIcon = "";
          this.processImageDisabled = false;
          const data = {
            busNo: res.data.busNo,
            busType: res.data.busType,
            id: res.data.id,
            imgBase64: res.data.imgBase64,
            isDeleted: res.data.isDeleted
          };

          this.projectFunDetailInfo.processImages.push(data);
      }).catch(err=>{
          this.processImageText = "点击上传";
          this.processImageIcon = "";
          this.processImageDisabled = false;

      });
    },

    // 删除流程图
    delProcessImage(del_id){
        this.$confirm('是否删除该流程图', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(res => {
          this.loading = true;

          for(let i = 0; i < this.projectFunDetailInfo.processImages.length; i++){
            if(this.projectFunDetailInfo.processImages[i].id == del_id){
              this.projectFunDetailInfo.processImages.splice(i, 1);
            }
          }
          this.loading = false;
        }).catch(() => {
                this.loading = false;
        });



    },


    handleClick(){

    },
    // 导出需求word
    exportWord(funNo){
        this.download('ai_smart/fun/export/new/'+funNo, {}, `word_${new Date().getTime()}.docx`)
    },

    // 导入按钮操作
    handleImport() {
      this.upload.title = "导入";
      this.upload.open = true;
    },
     // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit();
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.upload.open = false;
      this.upload.isUploading = false;
      this.$refs.upload.clearFiles();
      this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
    },

    // 树形结构复选框勾选事件
    handleCheckChange(data, node) {
      this.treeSelectNode = [];
      const nodes = node.checkedNodes;
      const keys = node.checkedKeys;

      for(let i = 0; i < nodes.length; i++){
        if(nodes[i].isLeaf == 1){
          this.treeSelectNode.push(keys[i]);
        }
      }
    },

    // 一键生成测试点和用例
    handleAiCreateAllPointAndCase(){
      if(this.treeSelectNode.length == 0){
        this.$modal.alertWarning("请勾选需要一键生成的功能");
      }else{
        this.$confirm('是否一键生成测试点和用例(会覆盖已有数据)', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(()=>{
          const data = {funNos: this.treeSelectNode};
          aiCreateAllPointAndCase(data).then(res => {
            this.$modal.msgSuccess(res.msg);
            this.getBatchTaskRecordInfo_();
          });
        });

      }
    },

    // 一键生成未生成的测试点和用例，不会覆盖已存在的数据
    handleAiCreateAllIncrementPointAndCase(){

      this.$confirm('是否生成未生成的测试点和用例', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(()=>{
        const data = {funNos: [this.projectFunDetailInfo.funNo]};
        aiCreateAllIncrementPointAndCase(data).then(res => {
          this.$modal.msgSuccess(res.msg);
          this.getBatchTaskRecordInfo_();
        });
      });

    },

    // 保存需求更新
    save(){
      const data = deepCopy(this.projectFunDetailInfo);
      for(let i = 0; i < data.processImages.length; i++){
        data.processImages[i].imgBase64 = null;
      }
      for(let i = 0; i < data.processInfoList.length; i++){
        if(data.processInfoList[i].isChange == 2){
          data.processInfoList[i].id = null;
        }
      }
      for(let i = 0; i < data.rolePermissionList.length; i++){
        if(data.rolePermissionList[i].isChange == 2){
          data.rolePermissionList[i].id = null;
        }
      }
      for(let i = 0; i < data.pageInfos.length; i++){
        for(let j = 0; j < data.pageInfos[i].inputOptions.length; j++){
          if(data.pageInfos[i].inputOptions[j].isChange == 2){
            data.pageInfos[i].inputOptions[j].id = null;
          }
        }
        for(let j = 0; j < data.pageInfos[i].outOptions.length; j++){
          if(data.pageInfos[i].outOptions[j].isChange == 2){
            data.pageInfos[i].outOptions[j].id = null;
          }
        }

        for(let j = 0; j < data.pageInfos[i].pageRuleList.length; j++){
          if(data.pageInfos[i].pageRuleList[j].isChange == 2){
            data.pageInfos[i].pageRuleList[j].id = null;
          }
        }
      }
      save(data).then((res)=>{
        this.$modal.msgSuccess(res.msg);
        getFunInfoNew(this.projectFunDetailInfo.funNo).then(response => {
          this.projectFunDetailInfo = response.data;
        });
      }).catch();
    },

    checkPass(){
      const data = {
        projectFunNo: this.projectFunDetailInfo.funNo,
        isChecked: 1
      };

      check(data).then((res)=>{
        this.$modal.msgSuccess(res.msg);
        getFunInfoNew(this.projectFunDetailInfo.funNo).then(response => {
          this.projectFunDetailInfo = response.data;
        });
      })
    }
  }
};
</script>
